<template>
	<el-card class="box-card">
	  <div slot="header" class="clearfix">
	    <span>服务评价</span>
	    <el-button style="float: right; padding: 3px 0" type="text">操作按钮</el-button>
	  </div>
	  <div class="text item">
	    <div class="block">
	      <span class="demonstration">区分颜色</span>
	      <el-rate v-model="value2":colors="colors">
	      </el-rate>
	    </div>
	  </div>
	</el-card>
</template>

<script>
	export default {
	    data() {
	      return {
	        value1: null,
	        value2: null,
	        colors: ['#99A9BF', '#F7BA2A', '#FF9900']  
	      }
	    }
	  }
</script>

<style>
	  .text {
	    font-size: 14px;
	  }
	
	  .item {
	    margin-bottom: 18px;
	  }
	
	  .clearfix:before,
	  .clearfix:after {
	    display: table;
	    content: "";
	  }
	  .clearfix:after {
	    clear: both
	  }
	
	  .box-card {
	    width: 480px;
	  }
</style>
